<template>
	<view class="_pad-y-20 _pad-x-10 _w-max _white-bg" style="min-height: 100vh;">
		<view class="_flex-row-mid _pad-x-15 _pos-rel _mar-bottom-25">
			<view class=""> {{param.id?param.name+'取车点':'已开通城市'}}</view>
			<view class="_h-max _pos-abs _left theme-color-bg" style="width: 8rpx;border-radius: 200rpx;"></view>
		</view>
		<view class="_flex-row-mid _flex-wrap" v-if="param.id" style="margin-left: 30rpx;margin-right: 30rpx;">
			<view @click="changeArea(item)" v-for="(item,index) in list" :key="index" class="_pad-x-10 _pad-y-5 title _font-13 _mar-bottom-10 _mar-right-10" style="border-radius: 200rpx;">{{item.title}}</view>
		</view>
		<view class="_flex-row-mid _flex-wrap" v-else style="margin-left: 30rpx;margin-right: 30rpx;">
			<view @click="changeArea(item)" v-for="(item,index) in list" :key="index" class="_pad-x-10 _pad-y-5 title _font-13 _mar-bottom-10 _mar-right-10" style="border-radius: 200rpx;">{{item.label}}</view>
		</view>
		<view class="_w-max _flex-col-mid" style="margin-top: 328rpx;" v-if="list.length === 0">
			<image style="width: 252rpx;height: 252rpx;" src="https://taxi.raxan.xyz/wechat/static/images/car/no-data.png" mode="widthFix"></image>
			<view class="_mar-top-10" style="color: #999;font-size: 32rpx;">暂无记录</view>
		</view>
	</view>
</template>

<script>
	import { getAllCity, getAllPlace} from '@/api/car.js'
	export default{
		data(){
			return{
				list:[],//城市/地址列表
				param:{},
			}
		},
		onLoad(option){
			this.param = JSON.parse(option.param);
			uni.setNavigationBarTitle({title:this.param.title})
			if(this.param.id){
				this.getAreaList(this.param.id)
			}else{
				this.getCityList();
			}
		},
		methods:{
			//获取城市列表
			getCityList(){
				let that = this;
				getAllCity().then((res)=>{
					that.list = res.data
				}).catch((err)=>{
					uni.showToast({ 
						title:'城市获取失败',
						icon:'none'
					})
				})
			},
			//获取地点列表
			getAreaList(id){
				let that = this;
				let params = {
					city_id: id,
				}
				getAllPlace(params).then((res)=>{
					that.list = res.data;
				}).catch((err)=>{
					uni.showToast({
						title:'服务点获取失败',
						icon:'none'
					})
				})
			},
			// 选择完毕
			changeArea(item){
				const eventChannel = this.getOpenerEventChannel();
				if(this.param.id){
					eventChannel.emit('getAddress', item);
				}else{
					eventChannel.emit('getCity', item);
				}
				uni.navigateBack();
			},
		},
	}
</script>

<style scoped lang="scss">
.title{background-color: #F7F7F7;color:#666666}
</style>